<template>
    <view class="user-info flex-between">
        <view
            class="flex-row gap-[20rpx]"
            style="width: 77%"
            @click.stop="
                $jump('/views/subViews/userHomePage/index/index?' + idName + '=' + findid(info))
            "
        >
            <view class="avatar">
                <image mode="aspectFill" :src="info.shop ? info.shop.avatar : info.avatar"> </image>
                <image
                    :src="$getImg('/img/icon/my/mark.png')"
                    mode="widthFix"
                    class="mark"
                    v-if="info[typeKey] === 2"
                />
            </view>
            <view class="username flex-column-between" style="width: 78%">
                <view class="name">
                    <fui-overflow-hidden
                        color="#3d3d3d"
                        size="28"
                        fontWeight="700"
                        :text="info.shop ? info.shop.name : info.nickname"
                    ></fui-overflow-hidden>
                    <!-- {{ info.userNickname }} -->
                </view>
                <view class="biref">
                    <fui-overflow-hidden
                        size="24rpx"
                        color="#999999"
                        :text="info.intro"
                        row="1"
                    ></fui-overflow-hidden>
                </view>
            </view>
        </view>
        <view>
            <view v-if="isOwn" class="follow flex-center" @click.stop="manageFn(info)">管理</view>

            <view
                v-else
                :class="[
                    info.userBehaviorEcho &&
                    (info[props.typeKey] === 1
                        ? !!info.userBehaviorEcho.followUserFlag
                        : info.userBehaviorEcho.followShopFlag)
                        ? 'follow'
                        : 'unfollow',
                    'flex-center'
                ]"
                @click.stop="followFn(info)"
            >
                {{
                    info.userBehaviorEcho &&
                    (info[props.typeKey] === 1
                        ? !!info.userBehaviorEcho.followUserFlag
                        : info.userBehaviorEcho.followShopFlag)
                        ? '已关注 '
                        : '+ 关注'
                }}
            </view>
        </view>
    </view>
</template>

<script setup lang="ts">
import { userActionAPI } from '@/api/common'
const props = defineProps({
    info: {
        type: Object,
        default: () => ({
            userBehaviorEcho: {}
        })
    },
    isOwn: {
        // 是否为自己的  自己的有管理按钮
        type: Boolean,
        default: false
    },

    userIdKey: {
        typeL: String,
        default: ''
    },
    typeKey: {
        // 用户类型key  info的typeKey为1时 为用户 否则为其他的
        type: String,
        default: 'type'
    },
    // 跳转用户主页的 名字  factoryId 为工厂类型  uid 为用户类型
    idName: {
        type: String,
        default: 'factoryId'
    }
})
const emit = defineEmits(['reGetData', 'manage'])

const manageFn = (row: any) => {
    emit('manage', row)
}

console.log(1111, props.info)

const followFn = async (row: any) => {
    const flag =
        row[props.typeKey] === 1
            ? !!row.userBehaviorEcho.followUserFlag
            : !!row.userBehaviorEcho.followShopFlag

    if (flag) {
        const res = await uni.showModal({
            title: '提示',
            content: '确定取消关注吗？'
        })
        console.log(1111, res)
        if (!res.confirm) return
    }

    console.log(
        'oooo11111======',
        props.userIdKey,
        row.bindId || row[props.typeKey] === 1 ? row.uid : row.shopId,
        row
    )
    userActionAPI({
        type: 4,
        action: row[props.typeKey] === 1 ? 44 : 41,
        bindId: props.userIdKey
            ? row[props.userIdKey]
            : row.bindId || (row[props.typeKey] === 1 ? row.uid : row.shopId)
    }).then((res) => {
        if (res.code === 0) {
            emit('reGetData')
        }
    })
}

const findid = (row: any) => {
    if (props.userIdKey) {
        return row[props.userIdKey]
    }

    return (row.shop ? row.shop.id : row.bindId) || row.uid
}
</script>

<style lang="scss" scoped>
.user-info {
    .avatar {
        position: relative;
        image {
            width: 92rpx;
            height: 92rpx;
            border-radius: 50%;
        }
        .mark {
            width: 30rpx;
            position: absolute;
            right: 0;
            bottom: 0;
        }
    }

    .follow {
        background-color: #e6edff;
        color: #376af7;
        padding: 10rpx 20rpx;
        border-radius: 999rpx;
        width: 150rpx;
    }

    .unfollow {
        background-color: #376af7;
        color: #e6edff;
        padding: 10rpx 20rpx;
        border-radius: 999rpx;
        width: 100%;
    }

    .name {
        font-size: 14px;
        font-weight: 700;
        color: #3d3d3d;
    }
    .biref {
        font-size: 12px;
        color: #999999;
    }
}
</style>
